<template>
	<view class="pb120r">
		<navbar background="background-image: linear-gradient(to right, #2c6739, #99c043);"
			title="订单结算" back @onBack="goBack"
		></navbar>
		<view class="p20r">
			<view class="backColWhite p20r borRad10r disFlex borB1D919191">
				<view class="w200r h200r">
					<image :src="roomData.picZero" mode="aspectFill"
						class="wPer100 hPer100 borRad10r"
						@click="cliBannerImg"
					></image>
				</view>
				<view class="flex1 pl20r disFlex flDirColumn juConSpaBet">
					<view class="foWeiBold f32r webLiCl1 webBoxOrVer overHid disWebBox">
						{{roomData.name}}
					</view>
					<view class="webLiCl1 webBoxOrVer overHid disWebBox col7f7f7f">
						{{roomData.tname}}
					</view>
					<view class="colFf3627 f24r">
						会员¥
						<text class="f36r foWeiBold">
							{{roomData.vip_price}}
						</text>
						/小时
						<text class="col999 ml10r">
							原价¥{{roomData.price}}/小时
						</text>
					</view>
				</view>
			</view>
			<view class="backColWhite p20r borRad10r">
				<view class="disFlex lh70r">
					<view class="w150r col959595">
						服务时间
					</view>
					<view class="teAliRight flex1">
						{{optionData.start_time}} ~ {{optionData.end_time}}
					</view>
				</view>
				<view class="disFlex lh70r">
					<view class="w150r col959595">
						服务时长
					</view>
					<view class="teAliRight flex1">
						共{{Math.round((optionData.hourVal) * 100) / 100}}小时
					</view>
				</view>
				<view class="disFlex lh70r">
					<view class="flex1 col959595">
						会员卡（折扣{{roomData.card_discount}}）
					</view>
					<view :class="['teAliRight', 'flex1',
							card_id != '' ? 'col00c260' : 'colC72d21'
						]"
					>
						{{
							card_id != '' ? '您为会员' : '您非会员'
						}}
					</view>
				</view>
				<view class="disFlex lh70r">
					<view class="w150r col959595">
						时长费
					</view>
					<view class="teAliRight flex1 colFf3627">
						¥{{hourMoney}}
					</view>
				</view>
				<view class="disFlex lh70r">
					<view class="w150r col959595">
						套餐费
					</view>
					<view :class="['teAliRight', 'flex1',
							optionData.setMealId ? 'colFf3627' : ''
						]"
					>
						{{
							optionData.setMealId ? '¥' + optionData.setMealMoney : '无套餐'
						}}
					</view>
				</view>
			</view>
			<navigator url="/pages/index/memberCenter"
				class="h100r backColFcf3f4 borRad10r bSha0010u0rgb00001 mt20r disFlex aliItCenter pl20r pr20r"
			>
				<view class="flex1 foWeiBold f30r colF09d3d">
					开通会员享全场特惠
				</view>
				<view class="w200r teAliRight colDc9a5d">
					去了解
					<image src="/static/icons/iconRightOrange.png" mode="aspectFit"
						class="w35r h35r floRight ml10r"
					></image>
				</view>
			</navigator>
			<view class="backColWhite borRad10r pl20r pr20r mt20r">
				<view class="lh80r col7a7a7a">
					支付方式
				</view>
				<radio-group class="f30r" @change="radioChange1">
					<label class="disFlex lh120r borB1SEdeded">
						<view class="flex1 foWeiBold">
							<image src="/static/icons/iconBalanceGreen.png" mode="aspectFit"
								class="w60r h60r poRel top16r mr5r"
							></image>
							茶室余额
						</view>
						<view class="w70r">
							<radio value="0" :checked="0 == radCurrent"
								color="#99c043" style="transform: scale(0.9)"
							/>
						</view>
					</label>
					<label class="disFlex lh120r">
						<view class="flex1 foWeiBold">
							<image :src="baseUrl + 'iconWeChatGreen.png'" mode="aspectFit"
								class="w60r h60r poRel top16r mr5r"
							></image>
							微信支付
						</view>
						<view class="w70r">
							<radio value="1" :checked="1 == radCurrent"
								color="#99c043" style="transform: scale(0.9)"
							/>
						</view>
					</label>
				</radio-group>
			</view>
			<view class="backColWhite borRad10r pl20r pr20r pb20r mt20r">
				<view class="lh80r col2c6739 foWeiBold f30r">
					温馨提示
				</view>
				<view class="lh50r">
					<view v-if="!roomData.markedAry" class="teAliCenter col999">
						暂无数据
					</view>
					<view v-for="(item, index) in roomData.markedAry" :key="index">
						{{item}}
					</view>
				</view>
			</view>
		</view>
		<view class="poFixed bom0 left0 h100r wPer100 backColWhite pl20r pr20r disFlex boSiBorBox borT1SE5e5e5 aliItCenter">
			<view class="w250r col999">
				实付：
				<text class="foWeiBold colFf3627 f34r">
					¥{{orderMoney}}
				</text>
			</view>
			<view class="flex1">
				<view class="lh80r colFff backColE45f58 teAliCenter borRad40r w200r floRight"
					@click="cliAppointmentTime1"
				>
					去支付
				</view>
			</view>
		</view>
	</view>
</template>
<script>
import navbar from '@/components/navbar.vue'
import { baseUrl, imgNetUrl } from '@/utils/request.js'
import { getTaeRoomDataInfo, unifiedOrder,
	getMemberCardruleInfo } from '@/utils/api.js'
import { dateLimit } from '@/utils/utils.js'
export default {
	components: { navbar },
	data() {
		return {
			baseUrl,
			optionData: {},
			roomData: {},
			radCurrent: 0,
			card_id: '',
			hourMoney: 0,
			orderMoney: 0,
			
		}
	},
	onLoad(options) {
		if(options.item) {
			this.optionData = JSON.parse(options.item);
			console.log('this.optionData', this.optionData)
			getTaeRoomDataInfo({
				tid: this.optionData.tid,
				rid: this.optionData.rid
			}).then(res1 => {
				this.roomData = res1.data;
				this.roomData.vip_price = Math.round(Number(this.roomData.card_discount) * Number(this.roomData.price) * 100) / 100;
				if(this.roomData.pic && this.roomData.pic != '') {
					this.roomData.picZero = imgNetUrl + this.roomData.pic.split(',')[0];
				}else {
					this.roomData.picZero = '/static/images/logo.png';
				}
				console.log(this.roomData)
				if(this.roomData.marked_words) {
					this.roomData.markedAry = this.roomData.marked_words.split('|');
				}
				getMemberCardruleInfo({
					token: uni.getStorageSync('token')
				}).then(res2 => {
					if(res2.data && res2.data.type == 1) {
						this.card_id = res2.data.id;
						this.hourMoney = Math.round((Math.round((this.optionData.hourVal) * 100) / 100 * Number(this.roomData.price) * Number(this.roomData.card_discount)) * 100) / 100;
						this.orderMoney = this.hourMoney + Number(this.optionData.setMealMoney);
					}else {
						this.hourMoney = Math.round((Math.round((this.optionData.hourVal) * 100) / 100 * Number(this.roomData.price)) * 100) / 100;
						this.orderMoney = this.hourMoney + Number(this.optionData.setMealMoney);
					}
				})
			})
		}
	},
	methods: {
		goBack() {
			uni.navigateBack();
		},
		cliBannerImg() {
			console.log(this.roomData)
			if(this.roomData.pic && this.roomData.pic != '') {
				let urls = [];
				this.roomData.pic.split(',').forEach(item => {
					urls.push(imgNetUrl + item)
				})
				uni.previewImage({
					current: 0, urls
				})
			}
		},
		radioChange1(evt) {
			this.radCurrent = evt.detail.value;
		},
		cliAppointmentTime1() {
			if(this.radCurrent == 0) {
				uni.showModal({
					title: '提示', content: `确定余额支付${this.orderMoney}元？`, confirmColor: '#99c043',
					success:res1 => {
						if (res1.confirm) {
							this.cliAppointmentTime2(1);
						}
					}
				})
			}else if(this.radCurrent == 1) {
				this.cliAppointmentTime2(2);
			}
		},
		cliAppointmentTime2(payType) {
			unifiedOrder({
				token: uni.getStorageSync('token'),
				tid: this.optionData.tid,
				rid: this.optionData.rid,
				payType,
				start_time: this.optionData.start_time,
				end_time: this.optionData.end_time,
				order_type: this.optionData.order_type,//马上使用为2，提前预订传1或者不传都行
				order_status: 1,//续单传2，正常单传1或者不传都行
				sid: this.optionData.setMealId,
				card_id: this.card_id
			}).then(res1 => {
				if(payType == 1) {
					let title = '',
						content = '';
					if(res1.code == '000000') {
						title = '预订成功';
						content = '订单号：' + res1.data.out_trade_no;
						this.cliAppointmentTime3(1, title, content);
					}else {
						title = '预订失败';
						if(res1.code == '900001' || res1.code == '900002') {
							if(res1.code == '900001') content = '未查询到该店铺余额信息';
							if(res1.code == '900002') content = '余额支付余额不足';
							uni.showModal({
								title, content, cancelText: '我知道了',
								confirmText: '去充值', confirmColor: '#99c043',
								success:res2 => {
									if (res2.confirm) {
										uni.navigateTo({ url: '/pages/index/recharge' })
									} else if (res2.cancel) {
										
									}
								}
							})
						}else {
							content = res1.message;
							uni.showModal({
								title, content, confirmColor: '#99c043', showCancel: false, confirmText: '我知道了',
								success:res1 => {
									if (res1.confirm) {
									}
								}
							})
						}
					}
				}else if(payType == 2) {
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res1.data.timeStamp,
						nonceStr: res1.data.nonceStr,
						package: res1.data.package,
						signType: res1.data.signType,
						paySign: res1.data.paySign,
						success:res2 => {
							console.log('支付成功', res2);
							this.cliAppointmentTime3(1, '预订成功', '支付成功');
						}, fail:err2 => {
							console.log('支付失败-err2', err2);
							this.cliAppointmentTime3(2, '预订失败', '您已取消支付', res1.data.out_trade_no);
						}
					})
				}
			})
		},
		cliAppointmentTime3(type, title, content, out_trade_no) {
			if(type == 1) {
				let historyRoomList = uni.getStorageSync('historyRoomList');
				if(historyRoomList == '') historyRoomList = [];
				historyRoomList.push(this.roomData);
				uni.setStorageSync('historyRoomList', historyRoomList);
				uni.requestSubscribeMessage({
				  tmplIds: [
					  '3A5LLFNlLOI8FmuQg1VoTSQ2Z-sgMbdhENmlyfd15FM',//服务完成通知
					  'B8AviMN-18noH7ULHMevdxfu08liKx9vjG16v-LJHEE',//订单即将到期提醒
					  'yQ8VFslxofDFsztSLAEAhz1by8KftlqXeewH6a7ENbE'//订单付款通知
				  ],
				  success:res1 => {
					  console.log('res1', res1)
					  // {
						 //  EbBMjRz1108yYoetYXr8bF22iu6T_RzFEk91VuWNql8: "accept",
						 //  errMsg: "requestSubscribeMessage:ok"
					  // }
				  }, fail:err1 => {
					  console.log('err1', err1)
				  }
				})
				uni.showModal({
					title, content: '立即跳转订单列表一键使用', showCancel: false, confirmColor: '#99c043',
					success:res1 => {
						if (res1.confirm) {
							uni.switchTab({ url: '/pages/order/index' })
						}
					}
				})
			}else if(type == 2) {
				uni.showModal({
					title, content, confirmColor: '#99c043', showCancel: false, confirmText: '我知道了',
					success:res1 => {
						if (res1.confirm) {
							uni.redirectTo({
								url: '/pages/order/remainingPayments?out_trade_no=' + out_trade_no
							})
						}
					}
				})
			}
		},
	}
}
</script>
<style>
</style>